<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <meta charset=" UTF-8">
    <title>后台登录</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <!-- load css -->
    <link rel="stylesheet" type="text/css" href="myconfig/layui/css/layui.css" media="all">
    <link rel="stylesheet" type="text/css" href="css/login.css" media="all">
</head>
<body>
<div class="layui-canvs"></div>
<div class="layui-layout layui-layout-login">
    <h1>
        <strong>柳州市事项管理系统</strong>
        <em>Management System</em>
    </h1>
    <div class="layui-user-icon larry-login">
        <input type="text" placeholder="账号" class="login_txtbx" id="userLoginName"/>
    </div>
    <div class="layui-pwd-icon larry-login">
        <input type="password" placeholder="密码" class="login_txtbx" id="userPass"/>
    </div>
    <div class="layui-val-icon larry-login">
        <div class="layui-code-box">
            <input type="text" id="code" name="code" placeholder="验证码" maxlength="4" class="login_txtbx">
            <img id="captcha_img" alt="点击更换" title="点击更换" class="verifyImg" onclick="changeVerifyCode(this)" src="user/getKaptchaImage"/>
        </div>
    </div>


    <div class="layui-submit larry-login">
        <input type="button" value="立即登陆" class="submit_btn"/>
    </div>
    <div class="layui-login-text">
        <p>没有账号？去<a href="/user/register" th:href="@{/user/register}">注册</a></p>
        <p>© 2019 吴煜中小组 版权所有</p>
    </div>
</div>
<script type="text/javascript" src="common/layui/lay/dest/layui.all.js"
        th:src="@{/common/layui/lay/dest/layui.all.js}"></script>
<!-- 获取根路径 -->
<script th:replace="fragscript :: basePath"></script>
<script type="text/javascript" src="js/login.js" th:src="@{/js/login.js}"></script>
<script type="text/javascript" src="jsplug/jparticle.jquery.js" th:src="@{/jsplug/jparticle.jquery.js}"></script>
<script type="text/javascript">
    $(function () {
        $(".layui-canvs").jParticle({
            background: "#141414",
            color: "#E6E6E6"
        });
        var loginUrl = "/user/login"
        //登录功能
        $(".submit_btn").click(function () {

            $.ajax({
                url: basePath + loginUrl,
                data: {
                    "userLoginName": $("#userLoginName").val(),
                    "userPass": $("#userPass").val(),
                    "code":$("#code").val(),
                },
                success: function (result) {
                    if (result.code != 0) {
                        changeVerifyCode(document.getElementById("captcha_img"));
                        layui.layer.msg(result.message);
                        return;
                    }
                    location.href = "index.html";
                }
            })
        });
    });

    function changeVerifyCode(img){
        img.src="user/getKaptchaImage?" + Math.floor(Math.random()*100);
    }
</script>
</body>
</html>